import { ReactViewState, ReactView, reactControl, ReactViewControl } from "pao-aop-client";

import React, { ReactNode } from "react";

import { addon } from "pao-aop";
import { Modal } from "antd";

/**
 * 组件：名称状态
 */
export interface NTModalState extends ReactViewState {
}

/**
 * 组件：名称
 * 描述
 */
export class NTModal extends ReactView<NTModalControl, NTModalState> {
    render() {
        let { title, visible, onOk, okText, onCancel, content, cancelText, okButtonProps, footer, closable } = this.props;
        return (
            <div style={{}}>
                <Modal
                    title={title}
                    visible={visible}
                    onOk={onOk}
                    okText={okText}
                    onCancel={onCancel}
                    cancelText={cancelText}
                    okButtonProps={okButtonProps}
                    footer={footer}
                    bodyStyle={{ overflow: 'scroll', maxHeight: 500 }}
                    closable={closable}
                >
                    {content}
                </Modal>
            </div>
        );
    }
}

/**
 * 控件：名称控制器
 * 描述
 */
@addon('NTModal', '名称', '描述')
@reactControl(NTModal)
export class NTModalControl extends ReactViewControl {
    title?: string; // 顶上文字
    okText?: string | ReactNode; // 确认按钮文字
    visible?: boolean; // 对话框是否可见
    onOk?: () => void; // 点击确定回调
    onCancel?: () => void; // 取消按钮
    cancelText?: string;// 取消文字
    content?: any; // 内容
    okButtonProps?: any;
    footer?: any;
    closable?: boolean;
    constructor() {
        super();
    }
}